iT邦幫忙

2021 iThome 鐵人賽

DAY 16
0
Modern Web

網頁設計入門筆記系列 第 16

Day16顏色(CSS)

  • 分享至 

  • xImage
  •  

Color

今天來介紹如何選擇CSS的顏色
常用的方法種共有三種方式
我會將重點簡述一下哦

  • RGB
    這個方式是利用色彩的三原色Red(紅)、Green(綠)、Blue(藍)三者間用不同的參數數值來調整顏色
    公式是rgb(red, green, blue)
    舉個例子rgb(255, 0, 0) 我把R的參數設為255(最大) 而其餘的G和B設為0(最小)
    顯然地就會顯示出紅色
    因此可以推理出rgb(0, 0, 0)是黑色rgb(255, 255, 255)是白色
    若是三個參數三個都給一樣的值 那麼會顯示出不同強度的灰階哦

  • HEX
    它的概念和RGB一樣
    只是把(0-255)這個十進制定義的值變成16進制(00-ff)來定義
    它的表示方法我把它看成#(RRGGBB)
    和前一個例子一樣 若是我想把它顯示為紅色
    那麼我就給予參數#ff0000

  • HSL
    hsl(hue, saturation, lightness)
    我覺得這是比較難懂得一個
    它分別的參數是指 色相,飽和,亮度

色相的色輪是0~360度 0是紅色120是綠色240是藍色
飽和度是顏色的強度 0%是完全的灰色 100%是沒有灰色陰影的純色
亮度就比較容易理解一些 0%是全黑 100%是全亮

若平常用一些比較特殊的顏色我都會上網查它的參數數值
所以可以把重要常用的顏色背起來
其餘的特殊色要用到的時候再上網查詢會比較方便
所以大概理解一下參數的涵義就好了~


上一篇
Day15來吧 展示(CSS)
下一篇
Day17邊框(CSS)
系列文
網頁設計入門筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言